<template>
	<view class="bg_color list">
		 <up-input
		    placeholder=""
		    border="bottom"
			v-model="name"
		    clearable
		  ></up-input>
		  <view style="margin:16rpx; 0 0 16rpx;font-size:24rpx;color:#909090;">填写真实姓名, 能更好的帮助你解决问题</view>
		  <!-- 保存 -->
		  	<button class="preservation" @click="preservation">保存</button>
	</view>
</template>

<script setup>
	import Api from 'api';
	import { usersStore } from 'store/users.js';
	const userStore = usersStore();
	const api = new Api
	const onloadVal=ref(0)
	onLoad((option)=>{
		onloadVal=option.name
	})
	const name=ref(0)
	onMounted(()=>{
		name.value=onloadVal
	})
	const preservation = async (e) => {
		const result = await api.setting({username:name.value,id:userStore.users.id});
		if(result){
			userStore.users.username=result.username
			uni.navigateBack({
				delta:1
			})
		}
	}
</script>

<style scoped lang="scss">
	.list{
		padding: 32rpx;
		height: 100vh;
		.preservation {
			margin-top:190rpx;
			width: 686rpx;
			background:#458CFF;
			height: 96rpx;
			color: white;
			margin:190rpx auto;
			/* 向左移动自身宽度的50%来居中对齐 */
			text-align: center;
			/* 文本居中 */
			border-radius: 16rpx;
			line-height: 96rpx;
			font-size: 32rpx;
		}
		button::after{ border: none;} 
	}
</style>